@layout("/common/default.html",{title:'菜单管理'}){
   <!-- <style>
        .layui-btn:not(.layui-btn-lg ):not(.layui-btn-sm):not(.layui-btn-xs) {
            height: 34px;
            line-height: 34px;
            padding: 0 8px;
        }
    </style>-->

<table id="permissionTable" class="layui-table" lay-filter="munu-table"></table>
<!-- 操作 -->
<script type="text/html" id="table-toolbar">


    {{# if(d.type!=3){}}
    <a class="layui-btn layui-btn-normal layui-btn-xs layui-btn-radius" lay-event="addnext"><i
            class="layui-icon layui-icon-add"></i>添加下级菜单</a>
    {{#} else{}}
    <a class="layui-btn layui-btn-disabled layui-btn-xs layui-btn-radius"><i
            class="layui-icon layui-icon-add"></i>添加下级菜单</a>
    {{#} }}

    {{# if(d.type!=0){}}
    <a class="layui-btn layui-btn-primary layui-btn-xs layui-btn-radius" lay-event="edit"><i
            class="layui-icon layui-icon-edit"></i>编辑</a>

    <a class="layui-btn layui-btn-danger layui-btn-xs layui-btn-radius" lay-event="del"><i
            class="layui-icon layui-icon-delete"></i>删除</a>
    {{#} else {}}
    <a class="layui-btn layui-btn-disabled layui-btn-xs layui-btn-radius" lay-event="edit"><i
            class="layui-icon layui-icon-edit"></i>编辑</a>
    <a class="layui-btn layui-btn-disabled layui-btn-xs layui-btn-radius"><i
            class="layui-icon layui-icon-delete "></i>删除</a>
    {{#} }}





</script>
<script>
    layui.use([ 'laydate', 'openLayer','feng','utils', 'treetable'], function () {
        var  $ = layui.$,
            laydate = layui.laydate,
            openlayer = layui.openLayer,
            utils = layui.utils,
            treetable= layui.treetable,
            feng = layui.feng;

        laydate.render({elem: "#startTime", type: "datetime"});
        laydate.render({elem: "#endTime", type: "datetime"});
        layer.load(2);
        // 渲染表格
        var renderTable = function () {//树桩表格参考文档：https://gitee.com/whvse/treetable-lay

            treetable.render({
                elem: '#permissionTable',
                url: '/sys/menu/menuData',
                tree: {
                    iconIndex: 0,           // 折叠图标显示在第几列
                    isPidData: true,        // 是否是id、pid形式数据
                    haveChildName: 'haveChild',
                    treeLevel: '1',         //展开层级
                    idName: 'id',  // id字段名称
                    pidName: 'parentId'     // pid字段名称

                },
                height: 'full-120',
                skin: 'line',
                cols: [[
                    {field: 'name', title: '菜单名称'},
                    {field: 'href', title: '路径'},
                    {field: 'type', title: '类型', templet: function (d) {
                            return feng.getDictLabel('${fnc.getDictListJson("menu_type")}', d.type)
                        }},
                    {
                        field: 'isShow', title: '可见', templet: function (d) {
                            return d.isShow === '0' ? '显示' : '隐藏'
                        }
                    },
                    {field: 'sort', title: '排序', sort: true},
                    {title: "操作",  align: "center", fixed: "right",  toolbar: '#table-toolbar',}
                ]],
                done: function (res, curr, count) {
                    layer.closeAll('loading');
                }
            });
        };
        renderTable();

        // 工具列点击事件
        treetable.on('tool(permissionTable)', function (obj) {
            var data = obj.data;
            switch (obj.event) {
                case "addnext":
                    addnext(data.id);
                    break;
                case "edit":
                    edit(data.id);
                    break;
                case "del":
                    del(data.id);
                    break;
            }
        });

        function addnext(id) {
            openlayer.opneAddNext({
                url:"/sys/menu/form",
                value:id
            })
        }

        function edit(id) {
            openlayer.opneEdit({
                url:"/sys/menu/form",
                value:id
            })
        }

        function del(id) {
            openlayer.confirm("确定要删除吗？", function () {
                utils.ajax("/sys/menu/delete?id="+ id, "post").done(function (result) {
                    if(result.code=="0"){
                        utils.tableSuccessMsg(result.msg);
                    }else {
                        utils.tableSuccessMsg("删除失败");
                    }
                    renderTable();
                }).fail(function (error) {
                });
            })
        }

    })



</script>

   @}